
// 定义并导出登录仓库模块
export default {
    //命名空间
    namespaced: true,
    // 1.state 仓库数据==>vue(data)
    state: {
        ruleForm: {
            username: "",
            password: "",
        },
        rules: {
            username: [
                { required: true, message: "请输入用户名", trigger: "blur" },
            ],
            password: [{ required: true, message: "请输入密码", trigger: "blur" }],
        },
        // 1.2存储用户登录后的信息
        userInfo:JSON.parse(localStorage.getItem('userInfo')|| "{}")
    },
    // 2.mutations 修改仓库数据的规则 不做复杂的逻辑操作 只做赋值操作
    mutations: {
        //给1.2定义规则
        changeUserInfo(state,newV){
            state.userInfo = newV
        }
    },
    // 3.actions 操作mutation规则来修改仓库数据
    actions: {
        //3.1定义执行登录
        userLogin(content,that) {
            //获取表单实例 然后调用表单实例中的validate方法进行数据校验
            // that:登录组件实例（this）
            // content:store实例对象 
            that.$refs.ruleForm.validate((valid) => {
                if (valid) {
                    //1.1校验成功执行登录
                    that.$api
                        .reqLogin(that.ruleForm)
                        .then((res) => {
                            //1.1.1提示登录成功
                            that.$message({
                                showClose: true,
                                message: "登陆成功",
                                type: "success",
                            });
                            //1.1.2缓存用户信息
                            localStorage.setItem("userInfo", JSON.stringify(res));
                            //1.1.3登陆成功 同步用户信息
                            content.commit('changeUserInfo',res)
                            //1.1.3跳转到首页
                            that.$router.push("/");
                        })
                        .catch((err) => console.log(err));
                } else {
                    //1.2校验失败弹窗提示用户
                    that.$message({
                        showClose: true,
                        message: "请确认用户名密码正确",
                        type: "error",
                    });
                }
            });
        },
        //3.2用户退出
        userLoginOut(content,that){
            //2.1提示用户是否确认退出
            that.$confirm('确定要退出吗?', '温馨提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                //2.2用户同意退出 清除本地缓存
                localStorage.removeItem("userInfo")
                //2.3同步用户想信息
                content.commit('changeUserInfo',{})
                //2.3跳转到登录页
                that.$router.replace('/login')
            }).catch(() => {});
            }
    },
    //4.
    getters: {
        getForm(state) {
            return state.ruleForm
        },
        getRule(state) {
            return state.rules
        }
    },


}